var button = document.querySelector('button')
var div = document.querySelector('div')
var input = document.querySelector('input')

// 后端服务
var SocketUrl = 'ws://localhost:8001/echo' 
//	创建一个websocket实例对象
const Socket = new WebSocket(SocketUrl)


// 	建立连接
Socket.addEventListener('open', function () {
	console.log('连接成功')
})


//  发送数据
button.addEventListener('click', function () {
	var value = input.value
	// send发送
	Socket.send(value)
	console.log('发送成功')
	// 发送完成之后清空input值
	input.value = ''
})

// 接收数据
Socket.addEventListener('message',function(value){
	console.log('接受成功')
	let val = new Array()
	var data = value.data
	var obj = {data}
	val.push(obj)
	val.map(item=>{
		let p =document.createElement('p')
		p.innerText = item.data
		div.appendChild(p)
	})
})

// 关闭
Socket.addEventListener('close',function(){
	console.log('已关闭')
	return this.addWebsocketHandle(); // 这里重新连接websocket
}) 
